<template>
	<view>
		<button class="add_follow" @click="gotoRouter('/pages-doctor/followAdd/followAdd')"><span>+</span>
			新建随访计划</button>
		<view class="wrap">
			<view class="overview">
				<view class="overview_item" @click="kind_change(0)" :class="kind_num == 0 ? 'kind' : ''">
					<view class="">待随访表</view>
					<view>{{ state_num.noPushNum }}</view>
				</view>
				<view class="overview_item" @click="kind_change(1)" :class="kind_num == 1 ? 'kind' : ''">
					<view>已随访表</view>
					<view>{{ state_num.pushNum }}</view>
				</view>
				<view class="overview_item" @click="kind_change(2)" :class="kind_num == 2 ? 'kind' : ''">
					<view>随访已提交</view>
					<view>{{ state_num.writeNum }}</view>
				</view>
				<view class="overview_item" @click="kind_change(3)" :class="kind_num == 3 ? 'kind' : ''">
					<view>随访未提交</view>
					<view>{{ state_num.noWriteNum }}</view>
				</view>
				<view class="overview_item" @click="kind_change(4)" :class="kind_num == 4 ? 'kind' : ''">
					<view>已取消</view>
					<view>{{ state_num.cancelNum }}</view>
				</view>

			</view>
			<view>
				<u-empty-state v-if="state_arr.length == 0" value="暂无相关记录"></u-empty-state>
				<view v-else class="information_card" v-for="(item, index) in state_arr" :key="item.id"
					@click="gotoRouter('/pages-doctor/followDetail/followDetail?id=' + item.id)">
					<view class="row_1">
						<view style="display: flex;">
							<image :src="item.avatar" />
							<view>{{ item.patientName }}</view>
							<view style="color:#B0B2B1 ;">{{ item.sex == '未知' ? '' : item.sex }} {{ item.age }} 岁</view>
						</view>
						<view :style="color_arr[index]">{{ String_arr[index] }}</view>
					</view>
					<view class="row_2">{{ item.tempName }}</view>
					<view class="row_3">计划时间：{{ item.planDate }}</view>
					<view class="row_4">
						<view>{{ item.createdTime }}</view>
						<view v-if="item.pushStatus == 0"><button @click.stop="FollowPlanCancel(item.id)">取消计划</button>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			kind_num: 0,  //0待随访  1已随访  2已提交  3未提交 4已取消
			state_num: {  //各个状态数量
				noPushNum: 0,  //未推送
				pushNum: 0,  //已推送
				writeNum: 0,  //已填写
				noWriteNum: 0,  //未填写
				cancelNum: 0,  //已取消
			},
			state_arr: [],  //数据列表
			pageNo: 1,  //页码
			total: '',
		}
	},
	// 下拉加载
	onReachBottom() {
		if (this.pageNo * 10 < this.total) {
			this.pageNo++
			this.getFollowStateList()
		}
	},
	onShow() {
		this.pageNo = 1
		this.state_arr = []  //清空数据
		this.getFollowStateNumber()
		this.getFollowStateList()
	},
	computed: {
		// 状态颜色
		color_arr() {
			let arr = []
			for (let i = 0, le = this.state_arr.length; i < le; i++) {
				const item = this.state_arr[i]
				if (item.pushStatus == 0) {
					arr.push('color:#FF9660')  //待推送
				} else if (item.pushStatus == 9) {
					arr.push('color:#B0B2B1')  //已取消
				} else if (item.pushStatus == 1) {
					if (item.writeStatus == 0) {
						arr.push('color:#FC4E4C')  //未填写
					} else if (item.writeStatus == 1) {
						arr.push('color:#24E104')  //已填写
					} else {
						arr.push('color:#B0B2B1')  //底色
					}
				}
			}
			return arr
		},
		// 状态字样
		String_arr() {
			let arr = []
			for (let i = 0, le = this.state_arr.length; i < le; i++) {
				const item = this.state_arr[i]
				if (item.pushStatus == 0) {
					arr.push('待推送')  //待推送
				} else if (item.pushStatus == 9) {
					arr.push('已取消')  //已取消
				} else if (item.pushStatus == 1) {
					if (item.writeStatus == 0) {
						arr.push('未填写')  //未填写
					} else if (item.writeStatus == 1) {
						arr.push('已填写')  //已填写
					} else {
						arr.push('未知')  //底色
					}
				}
			}
			return arr
		}
	},
	methods: {
		// 类型切换
		kind_change(type) {
			this.kind_num = type
			this.pageNo = 1
			this.state_arr = []  //清空数据
			this.getFollowStateList()
		},  //各个随访状态的数量
		getFollowStateNumber() {
			this.$api.getFollowStateNumber().then(e => {
				const { code, result } = e
				if (code == 200) {
					this.state_num = result
				}
			})
		},
		// 查询各个状态的列表
		getFollowStateList() {
			let data = {
				pageNo: this.pageNo,
				pageSize: 10,
				pushStatus: '',
				writeStatus: ''
			}

			if (this.kind_num == 0) {
				data.pushStatus = '0'  //待推送
			} else if (this.kind_num == 1) {
				data.pushStatus = '1'  //已推送

			} else if (this.kind_num == 2) {
				data.pushStatus = '1'
				data.writeStatus = '1'  //推送已填写

			} else if (this.kind_num == 3) {
				data.pushStatus = '1'
				data.writeStatus = '0'  //推送未填写
			} else if (this.kind_num == 4) {
				data.pushStatus = '9'  //已取消
			}
			this.$api.getFollowStateList(data).then(e => {
				const { code, result: { records, total } } = e
				if (code == 200) {
					this.total = total
					this.state_arr.push.apply(this.state_arr, records);
				}
			})
		},
		// 取消计划
		FollowPlanCancel(id) {
			uni.showModal({
				content: '确定取消该计划吗？',
				success: res => {
					if (res.confirm) {
						this.$api.FollowPlanCancel({ ids: [id] }).then(e => {
							if (e.code == 200) {
								this.kind_change(this.kind_num)
								this.getFollowStateNumber()
								uni.showToast({
									title: '取消成功',
									icon: 'none'
								});
							}
						})
					}
				}
			});

		},
	}
}
</script>

<style lang="less">
@import './followManage.less';
</style>
